<template>
	<view :class="['page',{'iphoneX':isIphoneX}]">  
		<view  class="body"> 
			
			
			<template >
				<template > 
					<view class="list-wrap">
						<view class="item">
							<view class="row-2">
								<text>产品名称</text>
								<text>{{detail.pname}}</text>
							</view>
							<view class="row-2">
								<text>更新时间</text>
								<text>{{detail.last_update_time}}</text>
							</view>
							<view class="row-2">
								<text>{{detail.sname}}库存</text>
								<text>{{detail.p_count}}{{detail.uname}}</text>
							</view>
							<view class="row-2">
								<text>换算</text>
								<text>{{detail.hs_unit_count}}</text>
							</view>
							<view class="row-2 btn-wrap">
								<navigator :url="'/package_kucun/yuding-xuqiu/yuding-xuqiu?pid='+pid+'&id='+id" hover-class="none" class="btn">预订需求</navigator> 
								<view class=" ">共有{{list.length}}条需求</view>
								<!-- <view class="btn" @click="del(item.id)">删除</view> -->
							</view>
						</view> 
					</view>
					 
					<view class="h45 limit-tab">
						<view class="item" :class="{'active':apply_status==1}" @click="changetab(1)">
							<view class="name">未解决需求</view>
							<view class="active-line"></view>
						</view>
						<view class="item" :class="{'active':apply_status==2}" @click="changetab(2)">
							<view class="name">已解决需求</view>
							<view class="active-line"></view>
						</view> 
					</view>
					
					<template >
						<template v-if="list.length>0"> 
							<view class="list-wrap">
								<view class="item" v-for="(item,index) in list" :key="index">
									<view>
										<view class="row-2">
											<text>需求人</text>
											<text>{{item.username}}</text>
										</view>
										<view class="row-2">
											<text>需求数量</text>
											<text>{{item.pre_num}}{{item.uname}}</text>
										</view>
										<view class="row-2">
											<text>项目名称</text>
											<text>{{item.projectname}}</text>
										</view> 
									</view>	
									<u-button v-if="item.apply_status==1&&item.apply_user_id==userInfo.id" type="success" text="解决" size="small" @click="jiejue(index)"></u-button>
								</view>
								<c-loading :loadingState="loadingState"></c-loading>
							</view> 
						</template> 
						
						<c-empty v-else></c-empty>
					</template>
				</template>  
			</template>
		</view>  
		<!-- <c-footer> 
			<view slot="content" class="add-btn" @click="add">{{type==1?'新增产品':'新增材料'}}</view>
		</c-footer> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin:true, 
				isIphoneX:getApp().globalData.isIphoneX, 
				userInfo:uni.getStorageSync('userInfo'),
				id:'',
				pid:'',
				detail:{}, 
				list:[],
				apply_status:'1',
				loadingState:{
					default:false,
					loading:false,
					completed:false
				},
				page:1,
				limit:20
			}
		},
		onLoad(params) { 
			this.pid=params.pid;
			this.id=params.id;
			this.notice_id=params.id;
			this.productsubscribelistwx();
			this.productsubscribelistwxlist(); 
		},
		onShow() {
			
		}, 
		onReachBottom(){
			if(this.loadingState.completed){ 
				this.page=1;
				return false
			}else{
				this.page++;
				this.productsubscribelistwxlist(); 			
			}	 
		},
		methods: { 
			changetab(id){
				this.apply_status=id;
				this.list=[];
				this.page=1;
				this.productsubscribelistwxlist();
			},
			 
			async productsubscribelistwx(){  
				let res=await this.$api.user_api.productsubscribelistwx({ 
					id:this.id,
					pid:this.pid 
				});   
				console.log(res)
				if(res.data.code==200){  
					this.detail=res.data.data; 
				}
			}, 
			  
			async productsubscribelistwxlist(){
				let res=await this.$api.user_api.productsubscribelistwxlist({ 
					id:this.id,
					pid:this.pid,
					apply_status:this.apply_status,
					page:this.page,
					limit:this.limit
				});      
				console.log(res)
				if(res.data.code==200){  
					this.list=this.list.concat(res.data.data.list);
					if(res.data.data.list.length<this.limit){
						this.loadingState.completed=true;
					}
				}
			}, 
			
			async jiejue(idx){
				let res=await this.$api.user_api.productagree({
					apply_id:this.list[idx].apply_id
				}) 
				if(res.data.code==200){
					this.$showToast({
						icon:'success',
						title:res.data.msg,
						duration:1000,
					})
					this.list=[];
					this.page=1;
					this.productsubscribelistwxlist();
				}
			}
			  
		},
		computed:{
			 
		},
		watch:{
			 
		}
	}
</script>

<style lang="less" >
	.add-btn{
		height: 36px;
		line-height: 36px;
		width: 60%;
		margin: 5px auto;
		background: #1cab1b;
		border-radius: 8rpx;
		color: #fff;
		font-size: 30rpx;
		text-align: center;
	}  
	.limit-tab{
		background: #fff;
	} 
	.list-wrap{
		padding:20rpx 0;
		.item{ 
			padding:20rpx; 
			background: #fff;  
			border-bottom:5rpx solid #e5e5e5; 
			.row-2{
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 10rpx;
				color: #939393;
				font-size: 30rpx;
			}
			.btn-wrap{
				padding:20rpx 50rpx; 
				border-top: 1rpx solid #e5e5e5;
				.btn{
					padding: 10rpx 20rpx;
					background: #1cab1b;
					border-radius: 8rpx;
					color: #fff;
				}
			}
			 
		}
	}
   
</style>
